//订单库存
import SubTitle from "@/pages/OrderModule/common/components/SubTitle";
import { Alert, Button, Radio, Space } from "antd";
import { useState, useEffect } from "react";

const OrderInventory = ({ data, handUpDateBaseConfigData }) => {
	const { stockManageStatus, stockShortageStrategy } = data;
	const [radioValue1, setRadioValue1] = useState(0); //库存管理: 1 启用 0 禁用  //库存缺货策略
	const [radioValue2, setRadioValue2] = useState(1); //库存缺货策略： 1 库存不足的商品，走“档口采购”流程 2 订单库存不足，异常拦截

	useEffect(() => {
		setRadioValue1(stockManageStatus);
		setRadioValue2(stockShortageStrategy);
	}, [data]);

	//点击保存
	const handleSubmit = () => {
		handUpDateBaseConfigData({
			stockManageStatus: radioValue1,
			stockShortageStrategy: radioValue2
		});
	};

	return (
		<Space direction="vertical" size={20}>
			<SubTitle title="库存设置" as="s2" />
			<Alert message={<div><div>1、代发仓的订单，不管是否开启库存开关，都是走代发流程</div><div>2、自发跑量订单，如果启用库存，则需要维护库存，库存不足跑量订单会被拦截。如果禁用库存，则不需要维护库存，订单默认是库存订单。</div></div>} type="info" showIcon />
			<SubTitle
				title={
					<>
						是否启用库存管理<span style={{ fontWeight: 300 }}>（只针对自发仓订单）</span>
					</>
				}
				symbol
				as="s2"
			/>
			<Radio.Group onChange={e => setRadioValue1(e.target.value)} value={radioValue1}>
				<Space direction="vertical">
					<Radio value={1}>
						启用库存管理（启用，则自发仓商品需要判断库存，库存充足部分走“已有库存”流程，库存缺货部分走如下流程）
						{radioValue1 == 1 ? (
							<div style={{ marginTop: "8px" }}>
								<Radio.Group onChange={e => setRadioValue2(e.target.value)} value={radioValue2}>
									<Space direction="vertical">
										<Radio value={1}>库存不足的商品，走“档口采购”流程</Radio>
										<Radio value={2}>订单库存不足，异常拦截</Radio>
									</Space>
								</Radio.Group>
							</div>
						) : (
							""
						)}
					</Radio>
					<Radio value={0}>禁用库存管理（禁用，则自发仓商品全部走“档口采购”流程）</Radio>
				</Space>
			</Radio.Group>
			<Button onClick={handleSubmit} type="primary">
				保存
			</Button>
		</Space>
	);
};

export default OrderInventory;
